<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>数据统计 - AI故事生成器</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
    <link rel="stylesheet" href='/static/css/1.css'>
    <link rel="stylesheet" href="/static/css/data_statistics.css">
    <link rel="stylesheet" href="/static/css/header.css">
    <link rel="stylesheet" href="/static/css/footer.css">
    <script src="/static/js/header.js" defer></script>
</head>
<body>
{% include 'header.html' %}

<div class="container">
    <div class="stats-grid">
        <div class="stat-card">
            <div class="stat-icon">
                <i class="fas fa-users"></i>
            </div>
            <div class="stat-value">{{ users_count }}</div>
            <div class="stat-title">用户数量</div>
            {#            <div class="stat-change positive">#}
            {#                <i class="fas fa-arrow-up"></i> 12.5% 较上月#}
            {#            </div>#}
        </div>
        <div class="stat-card">
            <div class="stat-icon">
                <i class="fas fa-user-friends"></i>
            </div>
            <div class="stat-value">{{ authors_count }}</div>
            <div class="stat-title">作者数量</div>
            {#            <div class="stat-change positive">#}
            {#                <i class="fas fa-arrow-up"></i> 8.3% 较上月#}
            {#            </div>#}
        </div>
        <div class="stat-card">
            <div class="stat-icon">
                <i class="fas fa-book-open"></i>
            </div>
            <div class="stat-value">{{ stories_count }}</div>
            <div class="stat-title">故事数量</div>
            {#            <div class="stat-change positive">#}
            {#                <i class="fas fa-arrow-up"></i> 5.7% 较上月#}
            {#            </div>#}
        </div>
        <div class="stat-card">
            <div class="stat-icon">
                <i class="fas fa-pen-fancy"></i>
            </div>
            <div class="stat-value">{{ comments_count }}</div>
            <div class="stat-title">评论数量</div>
            {#            <div class="stat-change negative">#}
            {#                <i class="fas fa-arrow-down"></i> 2.1% 较上月#}
            {#            </div>#}
        </div>
    </div>
    <div class="tables-grid">
        <div class="table-card">
            <div class="table-title">阅读量排行榜</div>
            <table class="data-table">
                <thead>
                <tr>
                    <th>排名</th>
                    <th>故事标题</th>
                    <th>作者</th>
                    <th>阅读量</th>
                    {#                    <th>互动率</th>#}
                </tr>
                </thead>
                <tbody>
                {% for story in stories_read %}
                    {% if story.read > 0 %}
                        <tr>
                            <td>{{ forloop.counter }}</td>
                            <td>{{ story.title }}</td>
                            <td>{{ story.author.username }}</td>
                            <td>{{ story.read }}</td>
                            {#                            <td>#}
                            {#                                <div class="trend-indicator positive">#}
                            {#                                    <i class="fas fa-arrow-up"></i> 24.5%#}
                            {#                                </div>#}
                            {#                            </td>#}
                        </tr>
                    {% endif %}
                {% endfor %}
                </tbody>
            </table>
        </div>
        <div class="table-card">
            <div class="table-title">点赞量排行榜</div>
            <table class="data-table">
                <thead>
                <tr>
                    <th>排名</th>
                    <th>故事标题</th>
                    <th>作者</th>
                    <th>点赞量</th>
                    {#                    <th>互动率</th>#}
                </tr>
                </thead>
                <tbody>
                {% for story in stories_likes %}
                    {% if story.likes > 0 %}
                        <tr>
                            <td>{{ forloop.counter }}</td>
                            <td>{{ story.title }}</td>
                            <td>{{ story.author.username }}</td>
                            <td>{{ story.likes }}</td>
                            {#                            <td>#}
                            {#                                <div class="trend-indicator positive">#}
                            {#                                    <i class="fas fa-arrow-up"></i> 24.5%#}
                            {#                                </div>#}
                            {#                            </td>#}
                        </tr>
                    {% endif %}
                {% endfor %}
                </tbody>
            </table>
        </div>
        <div class="table-card">
            <div class="table-title">评论量排行榜</div>
            <table class="data-table">
                <thead>
                <tr>
                    <th>排名</th>
                    <th>故事标题</th>
                    <th>作者</th>
                    <th>评论量</th>
                    {#                    <th>互动率</th>#}
                </tr>
                </thead>
                <tbody>
                {% for story in stories_comments_count %}
                    {% if story.comments_count > 0 %}
                        <tr>
                            <td>{{ forloop.counter }}</td>
                            <td>{{ story.title }}</td>
                            <td>{{ story.author.username }}</td>
                            <td>{{ story.comments_count }}</td>
                            {#                            <td>#}
                            {#                                <div class="trend-indicator positive">#}
                            {#                                    <i class="fas fa-arrow-up"></i> 24.5%#}
                            {#                                </div>#}
                            {#                            </td>#}
                        </tr>
                    {% endif %}
                {% endfor %}
                </tbody>
            </table>
        </div>
        <div class="table-card">
            <div class="table-title">创作者排行榜</div>
            <table class="data-table">
                <thead>
                <tr>
                    <th>排名</th>
                    <th>创作者</th>
                    <th>作品数</th>
                    <th>点赞数</th>
                    {#                    <th>活跃度</th>#}
                </tr>
                </thead>
                <tbody>
                {% for foo in author %}
                    {% if foo.stories_count > 0 and foo.stories_likes > 0 %}
                        <tr>
                            <td>{{ forloop.counter }}</td>
                            <td>{{ foo.username }}</td>
                            <td>{{ foo.stories_count }}</td>
                            <td>{{ foo.stories_likes }}</td>
                            {#                            <td>#}
                            {#                                <div class="trend-indicator positive">#}
                            {#                                    <i class="fas fa-arrow-up"></i> 高#}
                            {#                                </div>#}
                            {#                            </td>#}
                        </tr>
                    {% endif %}
                {% endfor %}
                </tbody>
            </table>
        </div>
    </div>
</div>
{% include 'footer.html' %}
</body>
</html>